<template>
  <div>
    <h1>这是person组件</h1>
  </div>
  <div>
    <h2>姓名：{{ name }}</h2>
    <h2>年龄：{{ age }}</h2>
    <h2>手机号：{{ tel }}</h2>
    <button @click="changeName">改名</button>
    <button @click="changeAge">改年龄</button>
    <button @click="changeTel">改手机号</button>
    <button @click="count++">{{ count }}</button>
  </div>
</template>
<script>
export default{
    name:'person',
    data(){
        return{
            name:'张三',
            age:18,
            tel:'13800000000',
            count:0
        }
    },
    methods:{
        changeName(){
            this.name='李四'
        },
        changeAge(){
            this.age=20
            console.log(this.age)
        },
        changeTel(){
            this.tel='13900000000'
        },
        getInfo(){
            console.log(this.name,this.age,this.tel)
        }
    }
}
</script>

<style scoped>

</style>